<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Host List</title>
    <style>
        table {
            width: 100%;
            border-collapse: collapse;
        }
        table, th, td {
            border: 1px solid black;
        }
        th, td {
            padding: 8px;
            text-align: left;
        }
        th {
            background-color: #f2f2f2;
        }
    </style>
</head>
<body>
<h1>Host List</h1>
<table>
    <thead>
    <tr>
        <th>ID</th>
        <th>Name</th>
        <th>Status</th>
        <th>Tenant ID</th>
        <th>User ID</th>
        <th>Availability Zone</th>
        <th>VM State</th>
        <th>Task State</th>
        <th>Created</th>
        <th>In Recycle Bin</th>
        <th>SPOD ID</th>
        <th>Updated</th>
        <th>Flavor</th>
        <th>Fault</th>
    </tr>
    </thead>
    <tbody>
    {{range .hosts}}
    <tr>
        <td>{{.Id}}</td>
        <td>{{.Name}}</td>
        <td>{{.Status}}</td>
        <td>{{.TenantId}}</td>
        <td>{{.UserId}}</td>
        <td>{{.AvailabilityZone}}</td>
        <td>{{.VmState}}</td>
        <td>{{.TaskState}}</td>
        <td>{{.Created}}</td>
        <td>{{.InRecycleBin}}</td>
        <td>{{.SpodId}}</td>
        <td>{{.Updated}}</td>
        <td>
            <strong>ID:</strong> {{.Flavor.Id}}<br>
            <strong>Name:</strong> {{.Flavor.Name}}<br>
            <strong>vCPUs:</strong> {{.Flavor.Vcpus}}<br>
            <strong>RAM:</strong> {{.Flavor.Ram}} MB<br>
            <strong>Disk:</strong> {{.Flavor.Disk}} GB<br>
            <strong>GPUs:</strong> {{.Flavor.Gpus}}<br>
            <strong>ASIC Accelerators:</strong>
        </td>
        <td>{{.Fault}}</td>
    </tr>
    {{end}}
    </tbody>
</table>
</body>
</html>
